<template>

    <a-card hoverable :style="{ width: '560px',height: '90%',marginLeft: '80px',boxShadow: '#eee 25px 15px 15px'}" :showUser="showUser">

        <template #cover>
            <div
                    :style="{
          height: '160px',
          overflow: 'hidden',
        }"
            >
                <img
                        :style="{ width: '100%', transform: 'translateY(-20px)' }"
                        alt="dessert"
                        src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp"
                />
            </div>

        </template>

        <a-card-meta>
            <template #description>

                <a-descriptions
                        style="margin-top: 10px"
                        :data="data" size="medium"
                        title="个人信息" :column="1"/>

            </template>
        </a-card-meta>

    </a-card>


</template>


<script setup>
    import {ref, computed} from "@vue/reactivity";
    import {watch} from 'vue';
    import myAxios from "../plugins/myAxios";
    import {useRoute} from "vue-router";
    import {useRouter} from "vue-router";
    import {reactive} from 'vue';
    import message from "@arco-design/web-vue/es/message";
    import {onBeforeMount, onMounted, watchEffect} from "@vue/runtime-core";
    import {routes} from "@/router/routes";

    const flag = ref(false)
    const userRole = ref('未登录');
    const showUser = reactive({})
    onBeforeMount(async () => {
        const res = await myAxios.get('/user/current');
        //后端返回的code是0,则获取到了用户的信息，然后返回
        if (res.code == 0) {
            showUser.value = res.data
        } else {
            // showUser.value = '登录/注册'
        }
    })

    const data =ref([])
     watch(()=>showUser, (newValue, oldValue) => {

       if(newValue?.value?.username){

         data.value=[{
           label: '姓名',
           value: newValue.value['username']
         }, {
           label: '性别',
           value: newValue.value['gender']===0?'男':'女',
         },
             {
                 label: '权限',
                 value: newValue.value['userRole']===0?'普通用户':'管理员',
             },
           {
             label: '学校',
             value: newValue.value['school'],
           }, {
             label: '年龄',
             value: newValue.value['age']
           },
           {
             label: '邮箱',
             value: newValue.value['email']
           },
           {
             label: '注册时间',
             value: newValue.value['createTime']
           },
         ]
       }
     }, {immediate:true,deep: true})




</script>
